// 全局深色主题样式 - 强制覆盖所有组件
// 基于cp-ems-ui的配色方案

// 全局背景色
html, body {
  background-color: #46576e !important;
  color: #ffffff !important;
}

#app {
  background-color: #46576e !important;
  color: #ffffff !important;
}

// 强制所有容器使用深色主题
.d2-container,
.d2-layout-header-aside,
.d2-layout-header-aside-group,
.d2-theme-container,
.d2-theme-container-main,
.d2-theme-container-aside,
.d2-theme-container-content {
  background-color: #46576e !important;
  color: #ffffff !important;
}

// 主内容区域
.d2-theme-container-main {
  background-color: #46576e !important;
  
  .d2-container {
    background-color: #46576e !important;
  }
}

// 页面内容区域
.page-container,
.app-container,
.container-component {
  background-color: #46576e !important;
  color: #ffffff !important;
}

// 所有卡片组件
.el-card,
.card,
.common-card {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  color: #ffffff !important;
  
  .el-card__header,
  .card-header {
    background-color: #2a3950 !important;
    border-bottom: 1px solid #5f6e8a !important;
    color: #ffffff !important;
  }
  
  .el-card__body,
  .card-body {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
  }
}

// 表格组件
.el-table {
  background-color: #2c3d55 !important;
  color: #ffffff !important;
  
  &::before {
    background-color: #5f6e8a !important;
  }
  
  th, th.is-leaf {
    background-color: #2a3950 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #5f6e8a !important;
  }
  
  td {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(95, 110, 138, 0.3) !important;
  }
  
  tr {
    background-color: #2c3d55 !important;
    
    &:hover td {
      background-color: #323e52 !important;
    }
    
    &.current-row td {
      background-color: rgba(58, 123, 153, 0.2) !important;
    }
  }
  
  .el-table__empty-block {
    background-color: #2c3d55 !important;
  }
  
  .el-table__empty-text {
    color: #88a7b1 !important;
  }
  
  .el-table__fixed,
  .el-table__fixed-right {
    background-color: #2c3d55 !important;
    
    &::before {
      background-color: rgba(95, 110, 138, 0.3) !important;
    }
  }
}

// 分页组件
.el-pagination {
  background-color: transparent !important;
  
  .el-pager li {
    background-color: #2c3d55 !important;
    color: #88a7b1 !important;
    border: 1px solid #5f6e8a !important;
    
    &:hover {
      color: #a5def1 !important;
      background-color: #222e41 !important;
    }
    
    &.active {
      background-color: #3a7b99 !important;
      color: #ffffff !important;
      border-color: #3a7b99 !important;
    }
  }
  
  .btn-prev, .btn-next {
    background-color: #2c3d55 !important;
    color: #88a7b1 !important;
    border: 1px solid #5f6e8a !important;
    
    &:hover {
      color: #a5def1 !important;
      background-color: #222e41 !important;
    }
    
    &:disabled {
      background-color: #2c3d55 !important;
      color: rgba(136, 167, 177, 0.5) !important;
    }
  }
  
  .el-pagination__total,
  .el-pagination__jump {
    color: #88a7b1 !important;
  }
  
  .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
  }
  
  .el-select .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
  }
}

// 表单组件
.el-form {
  .el-form-item__label {
    color: #ffffff !important;
  }
  
  .el-form-item__content {
    color: #ffffff !important;
  }
  
  .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
    
    &:focus {
      border-color: #3a7b99 !important;
    }
    
    &::placeholder {
      color: rgba(255, 255, 255, 0.6) !important;
    }
    
    &:disabled {
      background-color: rgba(44, 61, 85, 0.5) !important;
      color: rgba(255, 255, 255, 0.5) !important;
    }
  }
  
  .el-textarea__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
    
    &:focus {
      border-color: #3a7b99 !important;
    }
    
    &::placeholder {
      color: rgba(255, 255, 255, 0.6) !important;
    }
  }
  
  .el-select .el-input__inner {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
  }
  
  .el-input-group__prepend,
  .el-input-group__append {
    background-color: #2a3950 !important;
    color: #ffffff !important;
    border-color: #5f6e8a !important;
  }
}

// 下拉选择框
.el-select-dropdown {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-select-dropdown__item {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
    
    &:hover {
      background-color: #222e41 !important;
      color: #a5def1 !important;
    }
    
    &.selected {
      background-color: #3a7b99 !important;
      color: #ffffff !important;
    }
    
    &.is-disabled {
      color: rgba(255, 255, 255, 0.5) !important;
    }
  }
}

// 按钮组件
.el-button {
  &--primary {
    background: linear-gradient(135deg, #3a7b99 0%, #70afce 100%) !important;
    border-color: #3a7b99 !important;
    color: #ffffff !important;
    
    &:hover {
      background: linear-gradient(135deg, #4189aa 0%, #a5def1 100%) !important;
      border-color: #4189aa !important;
    }
    
    &:active {
      background: linear-gradient(135deg, #3b697e 0%, #3a7b99 100%) !important;
      border-color: #3b697e !important;
    }
    
    &:disabled {
      background: rgba(58, 123, 153, 0.5) !important;
      border-color: rgba(58, 123, 153, 0.5) !important;
    }
  }
  
  &--default {
    background-color: transparent !important;
    border-color: #5f6e8a !important;
    color: #88a7b1 !important;
    
    &:hover {
      background-color: #222e41 !important;
      border-color: #a5def1 !important;
      color: #a5def1 !important;
    }
    
    &:active {
      background-color: #1a2533 !important;
      border-color: #3a7b99 !important;
      color: #3a7b99 !important;
    }
  }
  
  &--success {
    background-color: #67c23a !important;
    border-color: #67c23a !important;
    
    &:hover {
      background-color: #85ce61 !important;
      border-color: #85ce61 !important;
    }
  }
  
  &--warning {
    background-color: #e6a23c !important;
    border-color: #e6a23c !important;
    
    &:hover {
      background-color: #ebb563 !important;
      border-color: #ebb563 !important;
    }
  }
  
  &--danger {
    background-color: #f56c6c !important;
    border-color: #f56c6c !important;
    
    &:hover {
      background-color: #f78989 !important;
      border-color: #f78989 !important;
    }
  }
  
  &--info {
    background-color: #909399 !important;
    border-color: #909399 !important;
    
    &:hover {
      background-color: #a6a9ad !important;
      border-color: #a6a9ad !important;
    }
  }
  
  &--text {
    color: #88a7b1 !important;
    
    &:hover {
      color: #a5def1 !important;
    }
  }
}

// 对话框组件
.el-dialog {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-dialog__header {
    background-color: #2a3950 !important;
    border-bottom: 1px solid #5f6e8a !important;
    
    .el-dialog__title {
      color: #ffffff !important;
    }
    
    .el-dialog__headerbtn .el-dialog__close {
      color: #88a7b1 !important;
      
      &:hover {
        color: #a5def1 !important;
      }
    }
  }
  
  .el-dialog__body {
    background-color: #2c3d55 !important;
    color: #ffffff !important;
  }
  
  .el-dialog__footer {
    background-color: #2a3950 !important;
    border-top: 1px solid #5f6e8a !important;
  }
}

// 消息框组件
.el-message-box {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  
  .el-message-box__title {
    color: #ffffff !important;
  }
  
  .el-message-box__message {
    color: #ffffff !important;
  }
  
  .el-message-box__content {
    color: #ffffff !important;
  }
  
  .el-message-box__btns {
    .el-button {
      margin-left: 10px;
    }
  }
}

// 消息提示组件
.el-message {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  color: #ffffff !important;
  
  &.el-message--success {
    background-color: rgba(103, 194, 58, 0.1) !important;
    border-color: #67c23a !important;
    
    .el-message__content {
      color: #67c23a !important;
    }
  }
  
  &.el-message--warning {
    background-color: rgba(230, 162, 60, 0.1) !important;
    border-color: #e6a23c !important;
    
    .el-message__content {
      color: #e6a23c !important;
    }
  }
  
  &.el-message--error {
    background-color: rgba(245, 108, 108, 0.1) !important;
    border-color: #f56c6c !important;
    
    .el-message__content {
      color: #f56c6c !important;
    }
  }
}

// 通知组件
.el-notification {
  background-color: #2c3d55 !important;
  border: 1px solid #5f6e8a !important;
  color: #ffffff !important;
  
  .el-notification__title {
    color: #ffffff !important;
  }
  
  .el-notification__content {
    color: #ffffff !important;
  }
  
  .el-notification__closeBtn {
    color: #88a7b1 !important;
    
    &:hover {
      color: #a5def1 !important;
    }
  }
}

// 加载组件
.el-loading-mask {
  background-color: rgba(70, 87, 110, 0.8) !important;
}

.el-loading-spinner {
  .path {
    stroke: #a5def1 !important;
  }
  
  .el-loading-text {
    color: #ffffff !important;
  }
}

// 树形组件
.el-tree {
  background-color: transparent !important;
  color: #ffffff !important;
  
  .el-tree-node__content {
    color: #ffffff !important;
    
    &:hover {
      background-color: #222e41 !important;
    }
  }
  
  .el-tree-node.is-current > .el-tree-node__content {
    background-color: #3a7b99 !important;
    color: #ffffff !important;
  }
  
  .el-tree-node__expand-icon {
    color: #88a7b1 !important;
  }
}

// 标签页组件
.el-tabs {
  .el-tabs__header {
    background-color: transparent !important;
    
    .el-tabs__nav {
      background-color: transparent !important;
      
      .el-tabs__item {
        color: #88a7b1 !important;
        background-color: transparent !important;
        border-bottom: 2px solid transparent !important;
        
        &:hover {
          color: #a5def1 !important;
        }
        
        &.is-active {
          color: #c0edfc !important;
          border-bottom-color: #3a7b99 !important;
        }
      }
    }
  }
  
  .el-tabs__content {
    color: #ffffff !important;
  }
}

// 步骤条组件
.el-steps {
  .el-step__title {
    color: #ffffff !important;
  }
  
  .el-step__description {
    color: #88a7b1 !important;
  }
  
  .el-step__icon {
    background-color: #2c3d55 !important;
    border-color: #5f6e8a !important;
    color: #88a7b1 !important;
  }
  
  .el-step.is-process .el-step__icon {
    background-color: #3a7b99 !important;
    border-color: #3a7b99 !important;
    color: #ffffff !important;
  }
  
  .el-step.is-finish .el-step__icon {
    background-color: #67c23a !important;
    border-color: #67c23a !important;
    color: #ffffff !important;
  }
}

// 面包屑组件
.el-breadcrumb {
  .el-breadcrumb__item {
    .el-breadcrumb__inner {
      color: #88a7b1 !important;
      
      &:hover {
        color: #a5def1 !important;
      }
    }
    
    &:last-child .el-breadcrumb__inner {
      color: #ffffff !important;
    }
  }
  
  .el-breadcrumb__separator {
    color: #88a7b1 !important;
  }
}

// 菜单组件
.el-menu {
  background-color: #2a3950 !important;
  border-right: none !important;
  
  .el-menu-item {
    color: #88a7b1 !important;
    background-color: transparent !important;
    
    &:hover {
      color: #a5def1 !important;
      background-color: #222e41 !important;
    }
    
    &.is-active {
      color: #c0edfc !important;
      background-color: #3a7b99 !important;
    }
    
    i {
      color: inherit !important;
    }
  }
  
  .el-submenu {
    .el-submenu__title {
      color: #88a7b1 !important;
      background-color: transparent !important;
      
      &:hover {
        color: #a5def1 !important;
        background-color: #222e41 !important;
      }
      
      i {
        color: inherit !important;
      }
      
      .el-submenu__icon-arrow {
        color: inherit !important;
      }
    }
    
    &.is-active .el-submenu__title {
      color: #c0edfc !important;
      background-color: #3a7b99 !important;
    }
    
    .el-menu {
      background-color: #364966 !important;
      
      .el-menu-item {
        background-color: #364966 !important;
        color: #88a7b1 !important;
        
        &:hover {
          color: #a5def1 !important;
          background-color: #397a97 !important;
        }
        
        &.is-active {
          color: #c0edfc !important;
          background-color: #3a7b99 !important;
        }
      }
    }
  }
}

// 强制覆盖所有文本颜色
h1, h2, h3, h4, h5, h6,
p, span, div, label,
.text, .title, .content {
  color: inherit !important;
}

// 强制覆盖链接颜色
a {
  color: #88a7b1 !important;
  
  &:hover {
    color: #a5def1 !important;
  }
}

// 滚动条样式
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #2a3950;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb {
  background: #5f6e8a;
  border-radius: 4px;
  
  &:hover {
    background: #70afce;
  }
}

::-webkit-scrollbar-corner {
  background: #2a3950;
}

